<template>
	<view class="page_scroll_view">
		<tn-navbar fixed :bottom-shadow="false">订单管理</tn-navbar>
		<tn-sticky class="tn-white_bg">
			<tn-tabs v-model="currentTabIndex" :bottom-shadow="false" :scroll="false">
				<tn-tabs-item v-for="(item, index) in tabsData" :key="index" :title="item.text" />
				<template #bar>
					<tn-icon name="tabs-smile" type="primary" />
				</template>
			</tn-tabs>
		</tn-sticky>
		<scroll-view scroll-y="true">
			<view class="tn-p-sm">
				<VoucherVue v-if="currentTabIndex==0"></VoucherVue>
				<ComboVue v-if="currentTabIndex==1"></ComboVue>
				<DeliveryVue v-if="currentTabIndex==2"></DeliveryVue>
				<SpecialVue v-if="currentTabIndex==3"></SpecialVue>
			</view>
			<view style="height: 50rpx;"></view>
		</scroll-view>
	</view>
</template>

<script setup>
	import VoucherVue from "./components/Voucher.vue"
	import ComboVue from "./components/Combo.vue"
	import DeliveryVue from './components/Delivery.vue'
	import SpecialVue from './components/Special.vue'
	import {
		ref
	} from 'vue';

	const currentTabIndex = ref(0)
	const tabsData = [{
			text: '代金券',
		},
		{
			text: '套餐券',
		},
		{
			text: '配送订单',
		},
		{
			text: '特价订单',
		}
	]
</script>

<style scoped lang="scss">
</style>